<template>
  <div>
    <div class="header-warpper" @click="$router.back(-1)">
      <img src="../../assets/l_jt.png" alt />
      <span>添加提币地址</span>
    </div>
    <div class="m-label">资产名称</div>
    <div class="m-input-box" @click="$router.push('/currency')">
      <input class="m-input" disabled type="text" value placeholder="请输入您的资产名称" v-model="title" />
    </div>
    <div class="m-label">地址</div>
    <div class="m-input-box">
      <input class="m-input" type="text" value placeholder="请输入地址" v-model="price" />
    </div>
    <div class="m-label">备注</div>
    <div class="m-input-box">
      <input class="m-input" type="text" value placeholder="请输入备注" v-model="remark" />
    </div>
    <div class="m-label">交易密码</div>
    <div class="m-input-box">
      <input class="m-input" type="password" value placeholder="请输入交易密码" v-model="b_num" />
    </div>
    <div class="m-label">短信验证码</div>
    <div class="m-input-box">
      <input class="m-input" placeholder="请输入验证码" type="text" value v-model="code" />
      <span v-html="djs" @click="sendcode()"></span>
    </div>
    <div class="red_btn" @click="pushs">提交</div>
  </div>
</template>
<script>
import { setTimeout } from "timers";
export default {
  mounted() {
    if (sessionStorage.getItem("currency")) {
      var sess = JSON.parse(sessionStorage.getItem("currency"));
      this.title = sess.txt;
      this.titleid = sess.id;
    }
  },
  data() {
    return {
      title: "",
      titleid: "",
      price: "",
      remark: "",
      b_num: "",
      code: "",
      djs: "获取验证码"
    };
  },
  methods: {
    sendcode() {
      if (this.djs.indexOf("s") != -1) return;
      this.$axios.post("/index/otcexchange/sendcode", {}).then(res => {
        if (res.data.code == 0) {
          this.$createToast({ txt: res.data.msg, type: "txt" }).show();
          this.djs = "60s";
          var ts = this;
          var time = setInterval(function() {
            var num1 = parseInt(ts.djs);
            if (num1 <= 1) {
              ts.djs = "重新发送";
              clearInterval(time);
            } else {
              ts.djs = --num1 + "s";
            }
          }, 1000);
        } else {
          this.$createToast({ txt: res.data.msg, type: "txt" }).show();
        }
      });
    },
    pushs() {
      if (this.title && this.price && this.remark && this.b_num && this.code) {
        this.$axios
          .post("/index/mentionaddress/addmen", {
            type: this.titleid,
            address: this.price,
            remark: this.remark,
            trad_password: this.b_num,
            code: this.code
          })
          .then(res => {
            this.$createToast({
              txt: res.data.msg,
              type: "txt",
              time: 1100
            }).show();
            console.log(res.data);
            res.data.code == 0
              ? setTimeout(() => {
                  this.$router.back(-1);
                }, 1100)
              : "";
          });
      } else {
        this.$createToast({
          txt: "请填写完整",
          type: "txt",
          time: 1200
        }).show();
      }
    }
  }
};
</script>
<style lang="less" scoped>
.red_btn {
  width: 92%;
  margin: auto;
  margin-top: 2rem;
  margin-bottom: 1rem;
  height: 1.2rem;
  font-size: 0.453333rem;
  color: #fff;
  border-radius: 2px;
  background: linear-gradient(#0f44f4, #001c97);
  border: none;
  line-height: 1.2rem;
}
.header-warpper {
  margin-left: 4%;
  padding-left: 0;
  .f-flex();
  height: 1.333333rem;
  position: relative;
  color: #000;
  img {
    width: 0.213333rem;
    height: 0.373333rem;
  }
  span {
    font-size: 0.48rem;
    padding-left: 0.2rem;
  }
}
.f-flex {
  display: flex;
  display: -webkit-flex;
  align-items: center;
}
.m-label {
  padding-left: 4%;
}
.m-input-box {
  padding-right: 0;
  margin-left: 4%;
  justify-content: space-between;
  span {
    width: 35%;
    color: #3d65d1;
    font-size: 0.373333rem;
    margin-top: 0.58rem;
    margin-right: 4%;
  }
  .qh {
    .f-flex();
    img {
      width: 0.48rem;
      height: 0.48rem;
      margin-top: 0.5rem;
      margin-right: 0.32rem;
    }
  }
  .r_qh {
    width: 0.373333rem;
    height: 0.373333rem;
  }
}
.m-input {
  color: #000;
  font-size: 0.426667rem;
  font-weight: bold;
}
</style>

